<template>
	<view class="content">
		<view class="block swiper-block">
			<swiper :indicator-dots="false" :autoplay="false">
				<swiper-item v-for="(item) in swiperList" :key="item.id">
					<image :src="imageUrl+item.url" mode="heightFix" class="img-height"></image>
					<view v-if="item.id==='4'" @click="jump" class="entrance-btn">立即进入</view>
				</swiper-item>
			</swiper>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				swiperActive: 0,
				swiperList: [{
					id: '1',
					url: '/dingxi-jobs/login/1.jpg'
				}, {
					id: '2',
					url: '/dingxi-jobs/login/2.jpg'
				}, {
					id: '3',
					url: '/dingxi-jobs/login/3.jpg'
				}, {
					id: '4',
					url: '/dingxi-jobs/login/4.jpg'
				}],
				imageUrl: ''
			}
		},
		methods: {
			jump() {
				uni.reLaunch({
					url: '/pages/index/index'
				})
			}
		},
		onLoad() {
			if (this.$store.getters.identity) { //如果有身份缓存则跳转至选择身份页面
				this.jump();
			}
			this.imageUrl = this.globalConfig.imageUrl;
		}
	}
</script>

<style lang="scss">
	.content {
		width: 100%;
		background-color: #fff;

		.block {
			width: 100%;
			margin-bottom: 30rpx;
		}

		.block.swiper-block {
			height: 100vh;
			margin-top: 60rpx;
			margin: auto;

			swiper {
				height: 100%;
				margin: auto;

				swiper-item {
					height: 100%;
					margin: auto;
					display: flex;
					justify-content: center;

					.img-height {
						height: 100%;
					}
				}
			}
		}

		.entrance-btn {
			position: absolute;
			bottom: 250rpx;
			transform: translate(-50%, -50%);
			left: 50%;
			width: 400rpx;
			height: 96rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			background: #0356FE;
			color: #fff;
			font-size: 32rpx;
			border-radius: 60rpx;
		}
	}
</style>